<template>
  <view :style="themeColor">
    <view class="page">
      <view class="flex benben-position-layout flex flex-wrap align-center creatorder_flex_0"
        :style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
        <view class='flex flex-wrap align-center justify-between flex-sub creatorder_fd0_0'>
          <view class='flex flex-wrap align-center creatorder_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back"
            data-url="1">
          </view>
          <view class='flex flex-wrap align-stretch justify-center'>
            <text class='creatorder_fd0_0_c1_c0'>下单</text>
          </view>
          <view class='flex flex-wrap align-center justify-end creatorder_fd0_0_c0'>
          </view>
        </view>

      </view>
      <view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
      <!---申请售后-售后原因flex布局开始-->
      <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout creatorder_flex_1">
        <!-- <view class='flex align-center justify-between creatorder_fd1_0' @click="pickerDiy1706077549149=true">
          <view class='flex flex-wrap align-center'>
            <text class='creatorder_fd1_0_c0_c0'>*</text>
            <text class='creatorder_fd1_0_c0_c1'>选择型号</text>
          </view>
          <view class='flex flex-wrap align-center justify-center creatorder_fd1_0_c1'>
            <text>{{freerecyclingtype_name || '请选择'}}</text>
            <text class='fu-iconfont2  creatorder_fd1_0_c1_c1'>&#xe78a;</text>
          </view>
        </view> -->
        <!-- <view class='flex align-center justify-between creatorder_fd1_0' @click="isbrand=true">
          <view class='flex flex-wrap align-center'>
            <text class='creatorder_fd1_0_c0_c0'>*</text>
            <text class='creatorder_fd1_0_c0_c1'>选择品牌</text>
          </view>
          <view class='flex flex-wrap align-center justify-center creatorder_fd1_0_c1'>
            <text>{{brand_name || '请选择'}}</text>
            <text class='fu-iconfont2  creatorder_fd1_0_c1_c1'>&#xe78a;</text>
          </view>
        </view> -->
        <view class='flex align-center justify-between creatorder_fd1_0' @click="iscate=true">
          <view class='flex flex-wrap align-center'>
            <text class='creatorder_fd1_0_c0_c0'>*</text>
            <text class='creatorder_fd1_0_c0_c1'>选择种类</text>
          </view>
          <view class='flex flex-wrap align-center justify-center creatorder_fd1_0_c1'>
            <text>{{cate_name || '请选择'}}</text>
            <text class='fu-iconfont2  creatorder_fd1_0_c1_c1'>&#xe78a;</text>
          </view>
        </view>
        <!-- <view class='flex align-center justify-between creatorder_fd1_0' @click="istype=true">
          <view class='flex flex-wrap align-center'>
            <text class='creatorder_fd1_0_c0_c0'>*</text>
            <text class='creatorder_fd1_0_c0_c1'>选择型号</text>
          </view>
          <view class='flex flex-wrap align-center justify-center creatorder_fd1_0_c1'>
            <text>{{type_name || '请选择'}}</text>
            <text class='fu-iconfont2  creatorder_fd1_0_c1_c1'>&#xe78a;</text>
          </view>
        </view> -->
        <view class='flex align-center justify-between creatorder_fd1_0'>
          <view class='flex flex-wrap align-center'>
            <text class='creatorder_fd1_0_c0_c0'>*</text>
            <text class='creatorder_fd1_0_c0_c1'>估计重量</text>
          </view>
          <benben-input class='flex-sub creatorder_fd1_2_c2' type="digit" :placeholder="`请输入`" confirm-type="done"
            placeholder-style="color:#999;font-size:28rpx" v-model="guji_wghit" />
          <view class="text-df text-333 margin-left-sm">
            吨
          </view>
          <!-- <benben-flex-number-box class-name='flex flex align-center' input-class="creatorder_numberBoxInputfd1_1_c1"
            v-model="number" :min="1" :step="1" :opacity="0.3">
            <template #minus>
              <image class='creatorder_fd1_1_c1_c0' mode="aspectFit" :src='STATIC_URL+"51.png"'></image>
            </template>
            <template #plus>
              <image class='creatorder_fd1_1_c1_c0' mode="aspectFit" :src='STATIC_URL+"50.png"'></image>
            </template>

          </benben-flex-number-box> -->

        </view>
        <view class='flex align-center justify-between creatorder_fd1_0'>
          <view class='flex flex-wrap align-center'>
            <!-- <text class='creatorder_fd1_0_c0_c0'>*</text> -->
            <text class='creatorder_fd1_0_c0_c1'>数量</text>
          </view>
          <benben-input class='flex-sub creatorder_fd1_2_c2' type="digit" :placeholder="`请输入`" confirm-type="done"
            placeholder-style="color:#999;font-size:28rpx" v-model="number" />
          <!-- <benben-flex-number-box class-name='flex flex align-center' input-class="creatorder_numberBoxInputfd1_1_c1"
            v-model="number" :min="1" :step="1" :opacity="0.3">
            <template #minus>
              <image class='creatorder_fd1_1_c1_c0' mode="aspectFit" :src='STATIC_URL+"51.png"'></image>
            </template>
            <template #plus>
              <image class='creatorder_fd1_1_c1_c0' mode="aspectFit" :src='STATIC_URL+"50.png"'></image>
            </template>

          </benben-flex-number-box> -->

        </view>
        <view class='flex align-center creatorder_fd1_0' @click.stop="chooseMap">
          <text class='creatorder_fd1_0_c0_c0'>*</text>
          <text class='creatorder_fd1_0_c0_c1'>回收地址</text>
          <benben-input class='flex-sub creatorder_fd1_2_c2' type="text" :placeholder="`请选择`" confirm-type="done"
            disabled placeholder-style="color:#999;font-size:28rpx" v-model="address" />
        </view>
        <view class='flex-direction flex-wrap align-stretch flex creatorder_fd1_3'>
          <textarea class='flex-sub creatorder_input_fd1_3' confirm-type="done" :placeholder="'请输入详细地址'"
            :maxlength="800" :show-num='true' placeholder-style="color:rgba(191, 191, 191, 1);font-size:28rpx"
            v-model="detail_address" />
          <template>
            <view class='flex flex justify-end creatorder_numberfd1_3_c0'>
              <text class='creatorder_numberfd1_3_c0_c0'>{{detail_address.length}}</text>
              <text class='creatorder_numberfd1_3_c0_c0'>/</text>
              <text class='creatorder_numberfd1_3_c0_c0'>800</text>
            </view>
          </template>
        </view>
        <view class='flex align-center creatorder_fd1_0' @click.stop="open">
          <text class='creatorder_fd1_0_c0_c0'>*</text>
          <text class='creatorder_fd1_0_c0_c1'>选择上门时间</text>
          <view class="flex-sub creatorder_fd1_2_c2">{{time || '选择时间'}}</view>
          <!--       <benben-input class='flex-sub creatorder_fd1_2_c2' type="text" :placeholder="`选择时间`" confirm-type="done"
            :maxlength="30" :disabled='true' placeholder-style="color:#999;font-size:28rpx" v-model="time" /> -->
        </view>
        <view class='flex flex-wrap align-center justify-center creatorder_fd1_5'>
          <button class='creatorder_fd1_5_c0' @tap.stop="submitRefundFunc()">下单</button>
        </view>
        <view class='flex align-center justify-between creatorder_fd1_6' @tap.stop="handleJumpDiy"
          data-type="navigateTo" :data-url="`/pages/grzx/xuanzeshifu/xuanzeshifu`">
          <text class='creatorder_fd1_0_c0_c1'>选择师傅</text>
          <view class='flex flex-wrap align-center' v-if="user_id_2">
            <image class='creatorder_fd1_6_c1_c0' mode="aspectFill" :src='user_avatar'></image>
            <text class='creatorder_fd1_6_c1_c1'>{{user_name}}</text>
            <text class='fu-iconfont2  creatorder_fd1_6_c1_c2'>&#xe7f2;</text>
          </view>
          <view class='flex flex-wrap align-center' v-if="!user_id_2">
            <text class='creatorder_fd1_6_c1_c1' style="color: #999999;">不选择则自动分配</text>
            <text class='fu-iconfont2  creatorder_fd1_6_c1_c2'>&#xe7f2;</text>
          </view>
        </view>
        <view class='flex align-center creatorder_fd1_0'>
          <text class='creatorder_fd1_0_c0_c1'>备注</text>
        </view>
        <view class='flex-direction flex-wrap align-stretch flex creatorder_fd1_3'>
          <textarea class='flex-sub creatorder_input_fd1_3' confirm-type="done" :placeholder="'请输入详细地址'"
            :maxlength="200" :show-num='true' placeholder-style="color:rgba(191, 191, 191, 1);font-size:28rpx"
            v-model="remark_15370" />
          <template>
            <view class='flex flex justify-end creatorder_numberfd1_3_c0'>
              <text class='creatorder_numberfd1_3_c0_c0'>{{remark_15370.length}}</text>
              <text class='creatorder_numberfd1_3_c0_c0'>/</text>
              <text class='creatorder_numberfd1_3_c0_c0'>200</text>
            </view>
          </template>
        </view>
      </view>

      <!---申请售后-售后原因flex布局结束-->
      <view class="flex flex-wrap align-center justify-center benben-position-layout flex creatorder_flex_2"
        @click.stop="submitforcertificationFunc">
        <button class='creatorder_fd2_0'>下单</button>

      </view>
      <view :style="{height: '201rpx'}"></view>


    </view>
    <benben-picker ref="benbenWritePickerCodepicker2" :visible.sync="pickerDiy1706077549149"
      :label.sync='freerecyclingtype_name' :value.sync='freerecyclingtype_id' :options='sex_options' mode='selector'
      :mask-show='true' :timeout='true' :picker-height='88' default-type='aid'
      :default-props='{"label":"name","value":"aid"}'>
      <template #picker-header>
        <view class='flex flex-wrap align-center justify-between personalData_picker2_0'>
          <text class='personalData_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker2.cancel()">取消</text>
          <text class='personalData_picker2_0_c1'>选择型号</text>
          <text class='personalData_picker2_0_c2' @tap="$refs.benbenWritePickerCodepicker2.pickerConfirm()">确认</text>
        </view>
      </template>
    </benben-picker>
    <benben-picker ref="benbenWritePickerCodepicker3" :visible.sync="isbrand" :label.sync='brand_name'
      :value.sync='brand' :options='brandList' mode='selector' :mask-show='true' :timeout='true' :picker-height='88'
      default-type='name' :default-props='{"label":"name","value":"aid"}'>
      <template #picker-header>
        <view class='flex flex-wrap align-center justify-between personalData_picker2_0'>
          <text class='personalData_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker3.cancel()">取消</text>
          <text class='personalData_picker2_0_c1'>选择品牌</text>
          <text class='personalData_picker2_0_c2' @tap="$refs.benbenWritePickerCodepicker3.pickerConfirm()">确认</text>
        </view>
      </template>
    </benben-picker>
    <benben-picker ref="benbenWritePickerCodepicker4" :visible.sync="iscate" :label.sync='cate_name' :value.sync='cate'
      :options='cateList' mode='selector' :mask-show='true' :timeout='true' :picker-height='88'
      default-type='zhongleimingcheng' :default-props='{"label":"zhongleimingcheng","value":"aid"}'>
      <template #picker-header>
        <view class='flex flex-wrap align-center justify-between personalData_picker2_0'>
          <text class='personalData_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker4.cancel()">取消</text>
          <text class='personalData_picker2_0_c1'>选择种类</text>
          <text class='personalData_picker2_0_c2' @tap="$refs.benbenWritePickerCodepicker4.pickerConfirm()">确认</text>
        </view>
      </template>
      <benben-picker ref="benbenWritePickerCodepicker5" :visible.sync="istype" :label.sync='type_name'
        :value.sync='type_no' :options='typeList' mode='selector' :mask-show='true' :timeout='true' :picker-height='88'
        default-type='name' :default-props='{"label":"name","value":"aid"}'>
        <template #picker-header>
          <view class='flex flex-wrap align-center justify-between personalData_picker2_0'>
            <text class='personalData_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker5.cancel()">取消</text>
            <text class='personalData_picker2_0_c1'>选择型号</text>
            <text class='personalData_picker2_0_c2' @tap="$refs.benbenWritePickerCodepicker5.pickerConfirm()">确认</text>
          </view>
        </template>
      </benben-picker>
    </benben-picker>
    <!-- <benben-picker ref="benbenWritePickerCodepicker1" :visible.sync="pickerDiy1703520610264" :times.sync="half"
      mode='time' :picker-height='88' :current='true' :mask-show='true' fields='day' :timeout='true' start-year='现在'
      end-year='' from-data=''>
      <template #picker-header>
        <view class='flex flex-wrap align-center justify-between personalData_picker2_0'>
          <text class='personalData_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker1.cancel()">{{$t('取消')}}</text>
          <text>选择上门时间</text>
          <text class='personalData_picker2_0_c2'
            @tap="$refs.benbenWritePickerCodepicker1.pickerConfirm()">{{$t('确认')}}</text>
        </view>
      </template>
    </benben-picker> -->
    <junjun-detepicker ref="datetimePicker" v-model="value" mode="datetime" @submit="confirm">
    </junjun-detepicker>
  </view>
</template>
<script>
  import {
    validate
  } from '@/common/utils/validate.js'
  import amapFile from '@/libs/amap-wx.js';
  import junjunDetepicker from '@/components/junjun-detepicker/junjun-detepicker.vue'
  export default {
    components: {
      junjunDetepicker
    },


    data() {
      return {
        value: Number(new Date()),
        pickerDiy1703520610264: false,
        sex_options: [],
        pickerDiy1706077549149: false,
        number: '1',
        address: '',
        detail_address: '',
        time: '',
        lat: '',
        lng: '',
        freerecyclingtype_id: '',
        freerecyclingtype_name: '',
        user_id_2: '',
        user_name: '',
        user_avatar: '',
        brand: '',
        brand_name: '',
        cate: '',
        cate_name: '',
        type_no: "",
        type_name: "",
        isbrand: false,
        iscate: false,
        istype: false,
        brandList: [],
        cateList: [],
        typeList: [],
        remark_15370: '',
        guji_wghit: '',
        certified: ''
      };
    },
    computed: {
      themeColor() {
        return this.$store.getters.themeColor
      },
      isLogin() {
        return this.$store.state.token == '' ? false : true;
      }
    },
    watch: {},
    onLoad(options) {
      this.getList()
      this.myAmapFun = new amapFile.AMapWX({
        key: '994797a4a0bf876f4ad7a31d27ed0070'
      });
    },
    onUnload() {

    },
    onReady() {

    },
    onShow() {
      if (this.isLogin) {
        this.$api.get(global.apiUrls.post5c78c4772da97, {

        }).then(res => {
          this.certified = res.data.data.certified
        })
      }
      uni.$on('fhifu', data => {
        this.user_id_2 = data.id
        this.user_name = data.nickname
        this.user_avatar = data.avatar

      })
    },
    onHide() {

    },
    onResize() {

    },
    onPullDownRefresh() {

    },
    onReachBottom(e) {

    },
    onPageScroll(e) {

    },
    methods: {
      open() {
        this.$refs.datetimePicker.show();
      },
      confirm(e) {
        console.log('confirm', e);
        this.time = e.format
      },
      chooseMap() {
        let _this = this
        console.log('_this_this_this_this_this')
        uni.chooseLocation({
          success: (resule) => {
            console.log(resule, '地图');
            _this.lng = resule.longitude
            _this.lat = resule.latitude
            _this.$api.post(global.apiUrls.post65e6b89a95efe, {
              lng: _this.lng,
              lat: _this.lat,
            }).then(res => {
              if (res.data.code == 1) {
                _this.address = res.data.data.province + res.data.data.city + res.data.data.district +
                  res.data.data.township
              }
            })
            // _this.myAmapFun.getRegeo({
            //   location: resule.longitude + ',' + resule.latitude,
            //   success: (data) => {
            //     //成功回调
            //     let regeoData = data[0].regeocodeData.addressComponent;
            //     let location_city = regeoData.city.length ? regeoData.city : '';
            //     let location_province = regeoData.province;
            //     let location_district = regeoData.district;
            //     console.log(_this.location_province, '回调');
            //     _this.address = location_city + location_province + location_district +
            //       resule.name
            //   },
            //   fail: (info) => {
            //     //失败回调
            //     console.log('info111', info)
            //   }
            // })
          },
          fail: (info) => {
            //失败回调
            console.log('info111', info)
          }
        })
      },
      getList() {
        this.$api.post(global.apiUrls.post659e7205002a7).then(res => {
          if (res.data.code == 1) {
            this.sex_options = res.data.data
            this.freerecyclingtype_name = this.sex_options[0].name
            this.freerecyclingtype_id = this.sex_options[0].aid
          }
        })
        // this.$api.post(global.apiUrls.post65f2bbe3f1a2a).then(res => {
        //   if (res.data.code == 1) { //电池品牌
        //     this.brandList = res.data.data
        //     this.brand_name = this.brandList[0].name
        //     this.brand = this.brandList[0].aid
        //   }
        // })
        this.$api.post(global.apiUrls.post65f2bc2b01872).then(res => {
          if (res.data.code == 1) { //电池种类
            this.cateList = res.data.data
            this.cate_name = this.cateList[0].zhongleimingcheng
            this.cate = this.cateList[0].aid
          }
        })
        // this.$api.post(global.apiUrls.post65f2bc161f005).then(res => {
        //   if (res.data.code == 1) { //电池型号
        //     this.typeList = res.data.data
        //     this.type_name = this.typeList[0].name
        //     this.type_no = this.typeList[0].aid
        //   }
        // })
      },
      //提交认证信息
      async submitforcertificationFunc() {
        if (this.certified != '1') {
          this.$message.info('你未认证 请前往认证');
          setTimeout(res1 => {
            uni.navigateTo({
              url: '/pages/grzx/yonghurenzheng/yonghurenzheng'
            })
          }, 500)
          return false;
        }
        // if (this.certified === '0') {
        //   this.$message.info('认证审核中，无法下单');
        //   return false;
        // }
        // console.log('type_no', this.type_no)
        if (!validate(this.address, 'require')) {
          this.$message.info('请选择地址');
          return false;
        }
        // if (!validate(this.detail_address, 'require')) {
        //   this.$message.info('请填写详细地址');
        //   return false;
        // }
        if (!validate(this.time, 'require')) {
          this.$message.info('请选择时间');
          return false;
        }
        if (!validate(this.guji_wghit, 'require')) {
          this.$message.info('请输入估计重量');
          return false;
        }
        //请求方法
        //数据验证

        let data = await this.$api.post(global.apiUrls.post65d1760acd84e, {
          number: this.number,
          address: this.address,
          detail_address: this.detail_address,
          time: this.time,
          lat: this.lat,
          lng: this.lng,
          freerecyclingtype_id: this.freerecyclingtype_id,
          user_id_2: this.user_id_2,
          brand: this.brand_name,
          cate: this.cate_name,
          type_no: this.type_name,
          remark_15370: this.remark_15370,
          guji_wghit: this.guji_wghit
        });
        if (data.data.code != 1) {
          this.$message.info(data.data.msg);
          return
        }
        this.$message.info('提交成功');
        this.number = 1
        this.address = ''
        this.detail_address = ''
        this.time = ''
        this.lat = ''
        this.lng = ''

        this.user_id_2 = ''
        this.user_name = ''
        this.user_avatar = ''
        this.remark_15370 = ''
        uni.switchTab({
          url: '/pages/tabBar/orderList/orderList'
        })
        // this.getList()
      },
    }
  };
</script>
<style lang="scss" scoped>
  .personalData_picker2_0_c2 {
    color: var(--benbenFontColor6);
    font-size: 28rpx;
  }

  .personalData_picker2_0_c1 {
    font-size: 32rpx;
    color: var(--benbenFontColor1);
  }

  .personalData_picker2_0_c0 {
    font-size: 28rpx;
    color: var(--benbenFontColor2);
  }

  .personalData_picker2_0 {
    border-bottom: 1px solid #eee;
    background: #fff;
    padding: 0rpx 32rpx 0rpx 32rpx;
    line-height: 88rpx;
    border-radius: 25rpx 25rpx 0rpx 0rpx;
    background-size: 100% auto !important;
  }

  .page {
    width: 100vw;
    overflow-x: hidden;
    min-height: calc(100vh - var(--window-bottom));
    background: #F8F8F8;
    background-size: 100% auto;
  }

  .creatorder_flex_0 {
    background: #fff;
    width: 750rpx;
    height: 88rpx;
    overflow: hidden;
    z-index: 10;
    top: 0rpx;
    background-size: 100% auto !important;
  }

  .creatorder_fd0_0_c1_c0 {
    font-size: 36rpx;
    font-weight: 700;
    color: #333333;
    line-height: 50rpx;
  }

  .creatorder_fd0_0_c0 {
    width: 120rpx;
  }

  .creatorder_fd0_0 {
    padding: 0rpx 32rpx 0rpx 32rpx;
  }

  .creatorder_flex_1 {
    background: rgba(255, 255, 255, 1);
    border-radius: 16rpx;
    background-size: 100% auto;
    padding: 24rpx;
    margin: 24rpx;
  }

  .creatorder_fd1_6_c1_c2 {
    color: var(--benbenFontColor2);
    font-size: 24rpx;
  }

  .creatorder_fd1_6_c1_c1 {
    margin: 0rpx 12rpx 0rpx 12rpx;
    color: rgba(16, 51, 126, 1);
  }

  .creatorder_fd1_6_c1_c0 {
    width: 40rpx;
    height: 40rpx;
    border-radius: 100rpx;
  }

  .creatorder_fd1_6 {
    padding: 32rpx 0rpx 32rpx 0rpx;
  }

  .creatorder_fd1_5_c0 {
    background: var(--benbenbgColor4);
    border-radius: 44rpx 44rpx 44rpx 44rpx;
    font-size: 32rpx;
    color: var(--benbenFontColor3);
    width: 686rpx;
    height: 88rpx;
    line-height: 88rpx;
  }

  .creatorder_fd1_5 {
    position: fixed;
    bottom: calc(30rpx + var(--window-bottom));
    left: 0rpx;
    width: 750rpx;
    height: 88rpx;
  }

  .creatorder_numberfd1_3_c0_c0 {
    font-size: 24rpx;
    font-weight: 400;
    color: rgba(191, 191, 191, 1);
  }

  .creatorder_numberfd1_3_c0 {
    width: 100%;
    font-size: 24rpx;
    color: #FFFFFF;
    line-height: 42rpx;
    font-weight: 400;
    margin: 0rpx 0rpx 24rpx 0rpx;
  }

  .creatorder_input_fd1_3 {
    width: 100%;
    height: 140rpx;
    font-size: 28rpx;
    font-weight: 400;
    color: var(--benbenFontColor0);
  }

  .creatorder_fd1_3 {
    background: #F8F8F8;
    border-radius: 16rpx 16rpx 16rpx 16rpx;
    padding: 24rpx 24rpx 0rpx 24rpx;
    height: 272rpx;
    margin: 0rpx 0rpx 24rpx 0rpx;
  }

  .creatorder_fd1_2_c2 {
    text-align: right;
    font-size: 28rpx;
    font-weight: 400;
    color: #333;
  }

  .creatorder_fd1_1_c1_c0 {
    height: 50rpx;
    margin: 0rpx 4rpx 0rpx 4rpx;
    width: 50rpx;
  }

  ::v-deep .creatorder_numberBoxInputfd1_1_c1 {
    background: rgba(255, 255, 255, 1);
    width: 80rpx;
    height: 50rpx;
    text-align: center;
    color: #323232;
    font-size: 28rpx;
  }

  .creatorder_fd1_0_c1_c1 {
    color: var(--benbenFontColor2);
    font-size: 12rpx;
    margin: 0rpx 0rpx 0rpx 12rpx;
  }

  .creatorder_fd1_0_c1 {
    background: #F6F7F9;
    border-radius: 12rpx 12rpx 12rpx 12rpx;
    width: 210rpx;
    height: 64rpx;
  }

  .creatorder_fd1_0_c0_c1 {
    color: #333333;
    font-size: 28rpx;
    font-weight: 400;
    line-height: 40rpx;
  }

  .creatorder_fd1_0_c0_c0 {
    color: rgba(242, 43, 41, 1);
    font-size: 28rpx;
    font-weight: 400;
    line-height: 40rpx;
  }

  .creatorder_fd1_0 {
    border-bottom: 1px solid #eee;
    padding: 32rpx 0rpx 32rpx 0rpx;
  }

  .creatorder_flex_2 {
    background: #fff;
    width: 750rpx;
    height: 201rpx;
    overflow: hidden;
    z-index: 10;
    bottom: calc(0rpx + var(--window-bottom));
    background-size: 100% auto !important;
  }

  .creatorder_fd2_0 {
    border: 1px solid rgba(0, 0, 0, 0);
    background: var(--benbenbgColor4);
    border-radius: 44rpx 44rpx 44rpx 44rpx;
    font-size: 32rpx;
    color: #fff;
    width: 686rpx;
    height: 88rpx;
    line-height: 80rpx;
    font-weight: 500;
  }
</style>
